<template>
  <el-dialog :visible.sync="visible" :title="title" :close-on-click-modal="false" v-dialogDrag width="1100px" top="10px" class="tl-dialog" @open="open" @close="close">
    <el-form class="tl-form approval-area" ref="form" label-width="120px">
      <el-row>
        <div class="tl-form-line-title">
          办理意见
        </div>
        <el-col :span="backNodeList.length > 0 ? 12 : 18">
          <el-form-item label="" style="margin-left: -90px; margin-right: -20px">
            <el-input class="text-approval" type="textarea" :rows="3" placeholder="请填写办理意见" v-model="approvalopinion" maxlength="300" show-word-limit> </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="5" :offset="1" style="padding-top:10px;">
          <el-button :disabled="disabled" :loading="loading" type="success" @click="doApproval(1)">{{ isApproval ? buttonNameAgree : buttonNameFinish }}</el-button>
          <el-button :disabled="disabled" :loading="loading" type="danger" @click="doApproval(2)" v-if="isApproval && lastPhase !== 1 && lastPhase !== 2">{{ buttonNameNoAgree }}</el-button>
        </el-col>
      </el-row>
    </el-form>
    <approvalInfo :lastPhase="lastPhase" ref="subPage"></approvalInfo>
  </el-dialog>
</template>

<script>
import { getAction, putAction, postAction } from '@tapui/utils/http'
/** 子组件 */
import approvalInfo from './approvalInfo'
export default {
  name: 'ApprovalPage',
  components: { approvalInfo },
  data() {
    return {
      visible: false,
      title: '单据审批',
      subPage: 'div',
      nodeInsId: 0,
      nodeModel: {},
      isApproval: true,
      uiOperateState: 4,
      disabled: false,
      url: {
        // queryNodeInfo: 'base/flow/queryNodeInfo',
        queryNodeInfo: 'cbo/approvalNodeIns/queryNodeInfo',
        queryNodeCouldSkip: 'base/flowSkip/queryNodeCouldSkip',
        queryBackNode: 'cbo/approvalNode/queryBackNode',
        approvalAction: '',
        load: '/mms/suggestionFeedback/load',
        queryCodeList: '/mms/suggestionFeedback/dataCodeList',
        queryResponse: '/mms/response/responseList'
      },
      backNodeList: [],
      backNodeId: 0,
      approvalopinion: '',
      loading: false,
      approvalInfoModel: '',
      beforePassMethod: '',
      beforeBackMethod: '',
      buttonNameAgree: '同意',
      buttonNameNoAgree: '不同意',
      buttonNameFinish: '办理完成',
      // 无需办理，跳过功能
      displaySkip: false,
      skipOpinion: '【无需办理】',
      lastPhase: 0,
      response: '',
      alertMessage: '请填写办理意见'
    }
  },
  methods: {
    loadData() {
      getAction(this.url.queryNodeInfo, { nodeinsid: this.nodeInsId }).then((res) => {
        if (res.success) {
          this.nodeModel = res.result
          this.bindData()
          this.bindBackNode()
          this.queryApprovalInfo()
        } else {
          this.disabled = true
          this.$tap.alert(res.message)
        }
      })
    },
    queryResponse() {
      let param = {
        qry_sourcetype: 'MmsSuggestionFeedback',
        qry_sourceid: this.approvalInfoModel.id
      }
      getAction(this.url.queryResponse, param).then((res) => {
        if (res.success) {
          if (res.result.length > 0) {
            this.$refs.subPage.response.push(res.result[0])
          }
        } else {
          this.$tap.alert(res.message, 'warning')
        }
      })
    },
    // 判断当前流程的最新阶段
    findLastPhase() {
      switch (this.approvalInfoModel.latestphase) {
        case '开始':
          this.lastPhase = 0
          break
        case '负责人分发':
          this.lastPhase = 1
          break
        case '办理人':
          this.lastPhase = 2
          break
        case '负责人确认':
          this.lastPhase = 3
          break
        case '结束':
          this.lastPhase = 4
          break
      }
    },
    queryApprovalInfo() {
      // 获取审批详情页信息
      let params = {
        id: this.nodeModel.sourceid
      }
      getAction(this.url.load, params).then((res) => {
        if (res.success) {
          if (res.result) {
            this.approvalInfoModel = res.result
            this.$refs.subPage.model = res.result
            if (!this.$refs.subPage.model.dealperson) {
              this.$set(this.$refs.subPage.model, 'dealperson', this.$store.getters.user.code)
              this.$set(this.$refs.subPage.model, 'dealpersonname', this.$store.getters.user.name)
            }
            this.queryResponse()
            this.findLastPhase()
            // 负责人分发结点修改按钮名称
            if (this.approvalInfoModel.latestphase === '负责人分发' || this.approvalInfoModel.latestphase === '办理人') {
              this.buttonNameAgree = '办理完成'
            }
            if (this.approvalInfoModel.latestphase === '负责人确认') {
              this.alertMessage = '请填写审批意见'
            }
          }
        } else {
          this.$tap.alert(res.message, 'warning')
        }
      })
    },
    loadFlowSkip() {
      getAction(this.url.queryNodeCouldSkip, { nodeinsid: this.nodeInsId }).then((res) => {
        if (res.success) {
          this.displaySkip = res.result.could
          this.skipOpinion = res.result.opinion
        } else {
          this.$tap.alert(res.message)
        }
      })
    },
    bindData() {
      if (this.nodeModel.approvalparam) {
        let jsonParam = JSON.parse(this.nodeModel.approvalparam)
        if (jsonParam.hasOwnProperty('uiOperateState')) {
          this.uiOperateState = jsonParam.uiOperateState
        } else {
          this.uiOperateState = 4
        }
        if (jsonParam.hasOwnProperty('isapproval')) {
          this.isApproval = jsonParam.isapproval.toString() === '1'
        } else {
          this.isApproval = true
        }
        // 审批通过前，执行编辑页面中的某个方法，等待方法返回成功后才执行审批
        if (jsonParam.hasOwnProperty('beforePassMethod')) {
          this.beforePassMethod = jsonParam.beforePassMethod
        } else {
          this.beforePassMethod = ''
        }
        // 审批驳回前，执行编辑页面中的某个方法，等待方法返回成功后才执行审批
        if (jsonParam.hasOwnProperty('beforeBackMethod')) {
          this.beforeBackMethod = jsonParam.beforeBackMethod
        } else {
          this.beforeBackMethod = ''
        }
        // 同意按钮的显示名字
        if (jsonParam.hasOwnProperty('buttonNameAgree')) {
          this.buttonNameAgree = jsonParam.buttonNameAgree.toString()
        } else {
          this.buttonNameAgree = '同意'
        }
        // 不同意按钮的显示名字
        if (jsonParam.hasOwnProperty('buttonNameNoAgree')) {
          this.buttonNameNoAgree = jsonParam.buttonNameNoAgree.toString()
        } else {
          this.buttonNameNoAgree = '不同意'
        }
        // 办理按钮的显示名字
        if (jsonParam.hasOwnProperty('buttonNameFinish')) {
          this.buttonNameFinish = jsonParam.buttonNameFinish.toString()
        } else {
          this.buttonNameFinish = '办理完成'
        }
      } else {
        this.uiOperateState = 4
        this.isApproval = true
        this.beforePassMethod = ''
        this.beforeBackMethod = ''
        this.buttonNameAgree = '同意'
        this.buttonNameNoAgree = '不同意'
        this.buttonNameFinish = '办理完成'
      }
      const page = () => import('@/views/' + this.nodeModel.approvalform)
      this.subPage = page
      this.url.approvalAction = this.nodeModel.approvalaction
    },
    bindBackNode() {
      this.backNodeList = []
      getAction(this.url.queryBackNode, { nodeinsid: this.nodeInsId }).then((res) => {
        if (res.success) {
          this.backNodeList = res.result
        } else {
          this.disabled = true
          this.$tap.alert(res.message)
        }
      })
    },
    pageCreated() {
      this.$refs.subPage.id = this.nodeModel.sourceid
      this.$refs.subPage.isAdd = false
      this.$refs.subPage.visible = true
      this.$refs.subPage.disableEditSubmit = false
      this.$refs.subPage.uiOperateState = this.uiOperateState
      this.$refs.subPage.approvalNodeModel = this.nodeModel
      this.$refs.subPage.open()
    },
    doApproval(approvalType) {
      if (approvalType === 2 && this.backNodeList.length > 0) {
        if (this.backNodeId === 0) {
          this.$tap.alert('请选择退回节点')
          return
        }
      }
      if (approvalType === 2 && this.approvalopinion.length === 0) {
        this.$tap.alert(this.alertMessage)
        return
      }
      if (approvalType === 1 && this.approvalopinion.length === 0 && this.lastPhase === 2) {
        this.$tap.alert(this.alertMessage)
        return
      }
      this.loading = true
      if (this.beforePassMethod.length > 0 && approvalType === 1) {
        let method = new Promise(this.$refs.subPage[this.beforePassMethod])
        method
          .then((_) => {
            this.approval(approvalType)
          })
          .catch((err) => {
            this.loading = false
          })
      } else if (this.beforeBackMethod.length > 0 && approvalType === 2) {
        let method = new Promise(this.$refs.subPage[this.beforeBackMethod])
        method
          .then((_) => {
            this.approval(approvalType)
          })
          .catch((err) => {
            this.loading = false
          })
      } else {
        this.approval(approvalType)
      }
    },
    doSkipApproval() {
      this.approvalopinion = this.skipOpinion
      this.approval(1)
    },
    approval(approvalType) {
      let postData = {
        nodeinsid: this.nodeInsId,
        sourceid: this.nodeModel.sourceid,
        approvalopinion: this.approvalopinion,
        approvaltype: approvalType,
        backnodeid: this.backNodeId,
        nextuserid: 0
      }
      putAction(this.url.approvalAction, postData)
        .then((res) => {
          if (res.success) {
            this.$tap.message('操作成功', 'success')
            this.$emit('refresh')
            this.visible = false
          } else {
            this.$tap.alert(res.message)
          }
          this.loading = false
        })
        .catch((_) => {
          this.loading = false
        })
    },
    open() {
      this.approvalopinion = ''
      this.loadData()
    },
    close() {
      this.$emit('cancel')
      this.$refs.subPage.response = []
    }
  }
}
</script>

<style lang="scss" scoped>
.text-approval {
/deep/ .el-textarea__inner {
  background: #fffdef;
}
}

</style>
